import React, {PureComponent} from "react";
import {connect} from "react-redux";
import {Modal, notification} from "antd";
import {hideModify, modify, query} from "./actions";
import FormEditor from '../../components/FormEditor';
import lodash from 'lodash';
import {getPrincipal} from "../../lib/identity";

class ModifyModal extends PureComponent {

    handleCreate = () => {
        const formEditor = this.formEditor.props.form;
        if (formEditor) {
            const {dispatch, model} = this.props;
            formEditor.validateFieldsAndScroll((err, values) => {
                if (!err) {
                    const updateModel = {
                        ...values,
                        permissions: lodash.join(values['permissions'], ","),
                        canCheckData: lodash.join(values['canCheckData'], ","),
                        id: model.id
                    };
                    dispatch(modify({...updateModel, "opId": getPrincipal().id})).then(action => {
                        if (action.error !== true) {
                            formEditor.resetFields();
                            dispatch(hideModify());
                            dispatch(query({}));
                            notification.success({
                                message: '修改成功'
                            });
                        }
                    });
                }
            });
        }
    };
    handleCancel = () => {
        const {dispatch} = this.props;
        dispatch(hideModify());
    };

    render() {
        const {loading, visible, model, treeData, menuColumns, checkData} = this.props;
        let isAdmin = false;
        if ("超级系统管理员" === model.name || "系统管理员" === model.name) {
            model['permissions'] = menuColumns.map(column => column.value);
            isAdmin = true;
        } else {
            model['permissions'] = lodash.split(model['permissions'], ",");
            if (model['canCheckData'] && model['canCheckData'].length > 0) {
                model['canCheckData'] = lodash.split(model['canCheckData'], ",");
            } else {
                model['canCheckData'] = [];
            }
        }
        const schema = [
            {
                title: '基础信息',
                fields: [
                    {
                        field: 'name',
                        title: '角色名称',
                        type: 'text',
                        readonly: isAdmin,
                        fieldOptions: {
                            rules: [{required: true, message: '请输入角色名称'}]
                        }
                    }
                ]
            }];
        if (isAdmin) {
            schema[0].fields.push(
                {
                    field: 'permissions',
                    title: '菜单权限',
                    type: 'checkBoxSelector',
                    controlProps: {
                        dataSource: menuColumns,
                        disabled: true
                    }
                }
            );
        } else {
            schema[0].fields.push(
                {
                    field: 'permissions',
                    title: '栏目权限',
                    type: 'treeSelector',
                    controlProps: {
                        treeData: treeData,
                        labelField: "title",
                        valueField: "value",
                    }
                }
            );
            schema[0].fields.push(
                {
                    field: 'notice',
                    title: '是否接收通知',
                    type: 'switch'
                }
            );
            schema[0].fields.push(
                {
                    field: 'equalAdmin',
                    title: '授予机构权限',
                    type: 'switch'
                }
            );
            schema[0].fields.push(
                {
                    field: 'canCheckData',
                    title: '首页栏目权限',
                    type: 'select',
                    controlProps: {
                        options: checkData,
                        mode: "multiple"
                    }
                }
            );
        }
        return (
            <Modal
                title="修改"
                visible={visible}
                onOk={this.handleCreate}
                onCancel={this.handleCancel}
                confirmLoading={loading}
                okText="保存"
                cancelText="取消"
                width="40%"
            >
                <FormEditor
                    schema={schema}
                    column={1}
                    defaultReadonly={false}
                    showActionBar={false}
                    defaultValues={model}
                    wrappedComponentRef={inst => (this.formEditor = inst)}
                />
            </Modal>

        );
    }
}

const mapStateToProps = state => {
    return {
        ...state.role.modify,
        menuColumns: state.common.menuColumns,
        checkData: state.common.checkData,
        treeData: state.common.treeData
    };
};

export default connect(mapStateToProps)(ModifyModal);
